<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JS语法</title>
</head>

<body>

</body>
<script>
    // 条件语句

    // 判断当前数是奇数还是偶数
    // let num = prompt("请输入: ");
    // if (num % 2 == 0) {
    //     alert(num + "是偶数");
    // }
    // else if (num % 2) {
    //     alert(num + "是奇数");
    // }
    // else {
    //     alert("非法输入！");
    // }

    // 三目运算
    // 2 == "1" ? alert("1") : alert("不是1");

    // switch语句
    // let day = prompt("请输入:"); // day 是 String类型

    // day = parseInt(day);
    // switch (day) {
    //     case 1:
    //         alert("星期一");
    //         break;
    //     case 2:
    //         alert("星期二");
    //         break;
    //     case 3:
    //         alert("星期三");
    //         break;
    //     case 4:
    //         alert("星期四");
    //         break;
    //     case 5:
    //         alert("星期五");
    //         break;
    //     case 6:
    //         alert("星期六");
    //         break;
    //     case 7:
    //         alert("星期天");
    //         break;
    //     default:
    //         alert("非法星期");
    //         break;
    // }

    // 循环语句
    // for (var i = 1; i <= 10; i++) {
    //     console.log(i);
    // }
    // a = "hello world";
    // alert(a);
    // a = 21;
    // alert(a);

    // 数组

    // 获取数组元素
    // let arr = [11, 'aa'];
    // console.log(arr); // 数组名 -> 数组的整个信息
    // for (i = 0; i < arr.length; i++) {
    //     console.log(arr[i]); // 打印数组的元素
    // }

    // 新增数组元素
    // 1. 通过修改 length 新增
    // let arr = [11, 'aa'];
    // arr.length = 3; // 新增后的值默认是undefined
    // arr[2] = 'cc';
    // for (i = 0; i < arr.length; i++) {
    //     console.log(arr[i]);
    // }

    // 2. 通过下标新增
    // let arr = [];

    // arr[2] = 1;
    // console.log(arr);
    // console.log(arr[0]);

    // 3. 通过push追加
    // arr = [];
    // arr.push(1);
    // arr.push(2);
    // for (i = 0; i < arr.length; i++) {
    //     console.log(arr[i]);
    // }

    // 删除元素
    // arr = [];
    // for (i = 0; i < 100; i++) {
    //     arr[i] = i;
    // }
    // arr.splice(4);
    // for (i = 0; i < 100; i++) {
    //     console.log(arr[i]);
    // }

    // 函数
    // function add(x, y) {
    //     z = x + y;
    //     return z;
    // }

    // c = add(1, 2);
    // alert("add返回类型" + typeof (c));

    // alert("c = " + c);

    // function printHello() {
    //     alert("Hello!");
    // }
    // x = printHello();
    // alert("printHello返回类型" + typeof (x)); // 函数没有return，其返回类型时undefined

    // 关于参数个数
    // d = add(1, 1, 1); // 如果实参个数比形参个数多, 则多出的参数直接被忽略
    // alert(d); // 2

    // z = add(2); // 如果实参个数比形参个数少, 则此时缺少的形参值为 undefined
    // alert(z);   //  NaN

    // 函数表达式(函数赋值)
    // 匿名函数
    // let add = function () { // 函数名也可以不写
    //     // 计算1 ~ 100的和
    //     res = 0;
    //     for (i = 1; i <= 100; i++) {
    //         res += i;
    //     }
    //     return res;
    // }
    // alert(add()); // 通过变量名+()调用函数

    // 作用域
    // num = 123;
    // function test() {
    //     num = 456;
    //     alert("num = " + num);
    // }
    // test();

    // 作用域链
    // x = 3;
    // function test02() {
    //     x = 2;
    //     //test03();

    //     function test03() {
    //         // x = 1;
    //         alert(x);
    //     }
    // }

    // test02();

    // 对象

    // 创建对象
    // 法一：使用 字面量
    // let a = {}; // a对象的属性和方法都没有
    // let Stu = {
    //     // 属性
    //     name: "Weraphael",
    //     age: 18,
    //     height: 180,
    //     weight: 120,
    //     // 方法
    //     sayHello: function () {
    //         alert("Hello Weraphael");
    //     }
    // };

    // // 属性访问 两种方法
    // alert("My name is " + Stu.name);
    // alert("My age is " + Stu["age"]);
    // // 方法 访问
    // Stu.sayHello();

    // 法二：使用 new Object
    // 创建对象
    // Stu = new Object();
    // // 添加属性
    // Stu.name = "Weraphael";
    // Stu.age = 18;
    // Stu['height'] = 180;
    // Stu['weight'] = 120;
    // // 添加方法
    // Stu.sayhello = function () {
    //     alert("Hello " + Stu.name);
    // };
    // // 使用属性
    // alert(Stu.name);
    // // 使用方法
    // Stu.sayhello();

    // 法三：使用 构造函数
    // function 类名(属性/参数集合)
    // function Stu(name, age, sex) {
    //     this.name = name;
    //     this.age = age;
    //     this.sex = sex;

    //     this.sayHello = function () {
    //         alert("Hello " + this.name);
    //     }
    // }

    // stu1 = new Stu('Weraphael', 18, '男');
    // alert(stu1.name);
    // stu1.sayHello();

    // ES6 引入class关键字

    class Stu {
        constructor(name, age, sex) {
            this.name = name;
            this.age = age;
            this.sex = sex;
        }

        sayhello() {
            alert("Hello " + this.name);
        }
        // static关键字
        static other = "other";
        static Sum() {
            return 3;
        }
    };
    // stu1 = new Stu("Weraphael", 18, '男');
    // alert(stu1.name);
    // stu1.sayhello();
    // alert(Stu.other);
    // alert(Stu.Sum());

    // 继承
    class Peo extends Stu {
        constructor(name, age, sex, id) {
            super(name, age, sex);
            this.id = id;
        }
        // 重写父类方法sayhello
        sayhello() {
            alert("Hello " + this.name);
        }
    }

    peo1 = new Peo("小明", 18, '女', 1);
    alert(peo1.name);
    alert(peo1.age);
    alert(peo1.sex);
    alert(peo1.id);
    peo1.sayhello();
</script>

</html>